{include file="public/head"/}
<style type="text/css">
    .layui-table td, .layui-table th {
        position: relative;
        padding: 13px 10px;
        min-height: 19px;
        line-height: 19px;
        font-size: 14px;
    }
    .layadmin-backlog-body p cite {
        font-style: normal;
        color: #009688;
        font-size: 16px;
        font-weight: bold;
    }
</style>
<div class="layui-content-wrapper">
    <div class="layui-fluid">
        <div class="layui-row layui-col-space8">
            <!--搜索开始-->
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-header">搜索</div>
                    <div class="layui-card-body">
                        <div class="table-head-btn" style="margin-bottom: 10px;">
                            <div class="layui-form">
                                <div class="layui-inline">
                                    <label class="layui-form-label" style="width:auto;">关&nbsp; 键&nbsp; 词</label>
                                    <div class="layui-input-inline">
                                        <input class="layui-input" name="key" id="key" placeholder="订单号，手机号码，商品" autocomplete="off"/>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label" style="width:auto;">状态</label>
                                    <div class="layui-input-inline">
                                        <select name="status" lay-filter="status" lay-verify="required">
                                            <option value="0">全部</option>
                                            <option value="1">待支付</option>
                                            <option value="2">已支付</option>
                                            <option value="3">申请核销</option>
                                            <option value="4">已核销</option>
                                            <option value="5">已评价</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label" style="width:auto;">创建开始时间</label>
                                    <div class="layui-input-inline">
                                        <input placeholder="开始时间" class="layui-input" name="start_time"
                                               id="start_time" AUTOCOMPLETE="off" autocomplete="off"/>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label" style="width:auto;">创建结束时间</label>
                                    <div class="layui-input-inline">
                                        <input placeholder="结束时间" class="layui-input" name="end_time" id="end_time"
                                               AUTOCOMPLETE="off" autocomplete="off"/>
                                    </div>
                                </div>
                                <button class="layui-btn" data-type="reload">搜索</button>
                                <!--
                                <button class="layui-btn" id="addExcel_w">导出待发货订单</button>
                                -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--搜索结束-->

            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-header">数据列表</div>
                    <div class="layui-card-body">
                        <table class="layui-hide" id="list" lay-filter="list"></table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{include file="public/foot"/}

<script type="text/html" id="status">
    {{# if(d.status==1){ }}
    <span style="color: #FF5722">待支付</span>
    {{# }else if(d.status==2){ }}
    <span style="color: #FFB800 ">已支付</span>
    {{# }else if(d.status==3){ }}
    <span style="color: #009688">申请核销</span>
    {{# }else if(d.status==4){ }}
    <span style="color: #2F4056">已核销</span>
    {{# }else if(d.status==5){ }}
    <span style="color: #1E9FFF">已评价</span>
    {{# } }}
</script>
<script type="text/html" id="pay_type">
    {{# if(d.pay_type==1){ }}
    <span style="color: #FF5722">微信</span>
    {{# }else if(d.pay_type==2){ }}
    <span style="color: #FFB800 ">支付宝</span>
    {{# }else if(d.pay_type==3){ }}
    <span style="color: #009688">余额支付</span>
    {{# } }}
</script>
<script type="text/html" id="action">
    {{# if(d.status==1){ }}
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">
            <i class="layui-icon layui-icon-search"></i>查看
        </a>

        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">
            <i class="layui-icon layui-icon-delete"></i>删除
        </a>
    {{# }else if(d.status==2){ }}
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">
            <i class="layui-icon layui-icon-search"></i>查看
        </a>

    {{# }else if(d.status==3){ }}
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">
            <i class="layui-icon layui-icon-search"></i>查看
        </a>
        <a style="background-color: #009688;color: white" class="layui-btn layui-btn-primary layui-btn-xs" lay-event="deliver">
            <i class="layui-icon layui-icon-ok"></i>核销
        </a>
    {{# }else{ }}
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">
            <i class="layui-icon layui-icon-search"></i>查看
        </a>

    {{# } }}
</script>

<script>
    layui.config({
        base: '__LAYDMIN__',
        shade: 0
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'table', 'carousel', 'form'], function () {
        var $ = layui.$;
        var admin = layui.admin;
        var table = layui.table;
        var element = layui.element;
        var form = layui.form;
        var util = layui.util;
        var upload = layui.upload;
        var carousel = layui.carousel;
        var device = layui.device();
        var tableLoadDiv = window.top.layer.load(0,{shade:[0.15, '#000']}); //加载层,table.render完成时需要关闭
        //全部数据
        tableIn = table.render({
            elem: '#list',
            url: '{:url(SYS_PATH."/".CONTROLLER."/index")}',
            method: 'post',
            autoSort: false,
            loading: true,
            cols: [[
                {type: 'checkbox'},
                {field: 'id', title: 'ID', width: 60,align:'center'},
                {field: 'order_sn', title: '订单编号', width: 200,align:'center'},
                {field: 'goods', title: '商品信息', width: 250,align:'center'},
                {field: 'total_price', title: '订单总价', width: 120,align:'center'},
                {field: 'order_name', title: '收货人', width: 120,align:'center'},
                {field: 'order_mobile', title: '收货电话', width: 120,align:'center'},
                {field: 'order_address', title: '收货地址', width: 250,align:'center'},
                {field: 'status', align: 'center', title: '状态', width: 120, toolbar: '#status',sort:true},
                {field: 'pay_type',  title: '支付方式',align:'center',width: 110, toolbar: '#pay_type'},
                {field: 'create_time', title: '下单时间', width: 160,sort:true,align:'center'},
                {width: 250,title:'操作', align: 'center', toolbar: '#action'}
        ]],
        page: true,
            done:function (res) {
            window.top.layer.close(tableLoadDiv);
        }
        });

    table.on('sort(list)', function (obj) {
        table.reload('list', {
            initSort: obj //记录初始排序，如果不设的话，将无法标记表头的排序状态。
            , where: { //请求参数（注意：这里面的参数可任意定义，并非下面固定的格式）
                sort_by: obj.field //排序字段
                , sort_order: obj.type //排序方式
            }
        });
    });


    let index1 = '';
    const option = {
        type: 1, // 页面层，可自定义内容
        title: '请输入快递信息',
        btn: ['确认', '取消'],
        content:
            '<div id="popup" style="display: flex;flex-direction: column;padding: 18px;">' +
                '<div class="layui-form-item">' +
                    '<div class="layui-inline">' +
                        '<label class="layui-form-label">快递公司</label>' +
                        '<div class="layui-input-inline">' +
                            '<input type="text" id="courier_company" lay-verify="required" value="" placeholder="快递公司" class="layui-input">' +
                        '</div>' +
                    '</div>' +
                '</div>' +
                '<div class="layui-form-item">' +
                    '<div class="layui-inline">' +
                        '<label class="layui-form-label">快递单号</label>' +
                        '<div class="layui-input-inline">' +
                            '<input type="text" id="courier_number" lay-verify="required" value="" placeholder="快递单号" class="layui-input">' +
                        '</div>' +
                    '</div>' +
                '</div>' +
            '</div>', // 内容
        area: ['400px', '270px'], // 模态框尺寸
        btnAlign: 'r', // 按钮对齐方式 l 左对齐 c 中间对齐 r 右对齐
        yes: function () {
            let courier_company = $('#courier_company').val();
            if (courier_company == ''){
                layer.msg('请输入快递公司名称');return;
            }
            let courier_number = $('#courier_number').val();
            if (courier_number == ''){
                layer.msg('请输入快递公单号');return;
            }
            var uri = "{:url('deliver')}?id=" + id + "&courier_company=" + courier_company + "&courier_number=" + courier_number;
            layui.doSomething(uri, "确认要将该订单发货吗", id, tableIn);
            layer.close(index1);
        }
    };

    //列表编缉与删除---监听工具条
    var id = '';
    table.on('tool(list)', function (obj) {
        var data = obj.data;
        id = data.id;
        if (obj.event === 'del') {
            var uri = "{:url(SYS_PATH.'/'.CONTROLLER.'/doDelete')}"
            layui.doDelete(uri, "确定要删除该订单吗？", id, obj);//单个删除接口
        } else if (obj.event === 'edit') {
            layui.layerOpen("{:url(SYS_PATH.'/'.CONTROLLER.'/edit')}?id=" + id, "编缉- " + data.title);
        } else if (obj.event === 'confirm') {
            var uri = "{:url(SYS_PATH.'/'.CONTROLLER.'/confirm')}"
            layui.doSomething(uri, "确认要将该订单通过审核吗", id, tableIn);
        }else if (obj.event === 'deliver') {
            layui.doSomething("{:url(SYS_PATH.'/'.CONTROLLER.'/deliver')}", '确认同意核销该订单吗', id, tableIn);
        }else if (obj.event === 'detail') {
            layui.layerOpen("{:url(SYS_PATH.'/'.CONTROLLER.'/detail')}?id="+id);
        }else if (obj.event === 'remind') {
            var uri = "{:url(SYS_PATH.'/'.CONTROLLER.'/remind')}"
            layui.doSomething(uri, "确认要将该提醒关闭吗", id, tableIn);
        }
    });


    //改变状态
    form.on('switch(status)', function (obj) {
        var id = this.value;
        var status = obj.elem.checked === true ? 1 : 2;
        admin.req({
            url: '{:url(SYS_PATH.'/'.CONTROLLER.'/doStatus')}'
            , type: 'post'
            , data: {'id': id, 'status': status}
            , success: function (res) {
                if (res.code == 0) {
                    window.top.layer.msg(res.msg, {time: 1000, icon: 1,shade:[0.5,'#000']});
                } else {
                    window.top.layer.msg(res.msg, {time: 1000, icon: 2,shade:[0.5,'#000']});
                    if (obj.elem.checked == true) {
                        $(obj.elem).prop('checked', false);
                    } else {
                        $(obj.elem).prop('checked', true);
                    }
                    form.render();
                }
            }
        });
    });

    //监听头部按钮
    $('.clt-auth-btns .layui-btn').on('click', function () {
        var type = $(this).data('type');
        var title = $(this).data('title');
        if (type === 'add') {
            layui.layerOpen("{:url(SYS_PATH.'/'.CONTROLLER.'/add')}", title);
        } else if (type == 'deleteAll') {
            layui.deleteAll("{:url(SYS_PATH.'/'.CONTROLLER.'/doDeleteAll')}", "确定要批量删除吗？", tableIn);//tableIn为渲染列表对象
        }
    });

        // 导出Excel
        $('#addExcel_w').click(function () {
            // var start_time = $('#start_time').val();
            // var end_time = $('#end_time').val();
            // var user_group_id = $('#user_group_id').val();
            // var key = $('#key').val();
            var url="{:url(SYS_PATH."/Orders/exportExcel")}";
            // url = url+'?key='+key+'&start_time='+start_time+'&end_time='+end_time+'&user_group_id='+user_group_id;
            window.open(url);
        });


    //搜索重载
    $('.table-head-btn .layui-btn').on('click', function () {
        var type = $(this).data('type');
        if (type === 'reload') {
            var key = $('#key').val();
            //执行重载
            table.reload('list', {
                page: {curr: 1 },
                where: {
                    key: key
                }
            });
        }
    });

    //分类选择
    form.on('select(cid)', function (data) {
        var cid = data.value;
        //执行重载
        table.reload('list', {
            page: {curr: 1 },
            where: {
                cid: cid
            }
        });
    });

    form.on('select(status)', function (data) {
        var status = data.value;
        //执行重载
        table.reload('list', {
            page: {curr: 1 },
            where: {
                status: status
            }
        });
    });

    //轮播切换
    $('.layadmin-carousel').each(function () {
        var othis = $(this);
        carousel.render({
            elem: this
            , width: '100%'
            , arrow: 'none'
            , interval: othis.data('interval')
            , autoplay: othis.data('autoplay') === true
            , trigger: (device.ios || device.android) ? 'click' : 'hover'
            , anim: othis.data('anim')
        });
    });

    $('.table-head-btn .layui-btn').on('click', function () {
        var type = $(this).data('type');
        if (type === 'reload') {
            var key = $('#key').val();
            var status = $('#status').val();
            var start_time = $('#start_time').val();
            var end_time = $('#end_time').val();
            if (start_time) {
                if (!end_time) {
                    layer.msg('请选择结束时间！');
                    return;
                }
            }
            if (end_time) {
                if (!start_time) {
                    layer.msg('请选择开始时间！');
                    return;
                }
            }
            //执行重载
            table.reload('list', {
                page: {curr: 1 },
                where: {
                    key: key,
                    status: status,
                    end_time: end_time,
                    start_time: start_time
                }
            });
        }
    });

    })
    ;
</script>
<script>
    layui.use('laydate', function () {
        var laydate = layui.laydate;

        //执行一个laydate实例
        laydate.render({
            elem: '#start_time'
            , type: 'datetime'
            , format: 'yyyy-MM-dd HH:mm:ss'//指定元素
        });
        laydate.render({
            elem: '#end_time'
            , type: 'datetime'
            , format: 'yyyy-MM-dd HH:mm:ss'//指定元素
        });
    });
</script>
</body>
</html>

